<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html class="x-admin-sm"
      xmlns:th="http://www.thymeleaf.org">
    
    <head>
        <meta charset="UTF-8">
        <title>角色列表</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="/static/admin/x-admin/css/font.css">
        <link rel="stylesheet" href="/static/admin/x-admin/css/xadmin.css">
        <script th:src="@{/static/admin/x-admin/lib/layui/layui.js}" charset="utf-8"></script>
        <script type="text/javascript" th:src="@{/static/admin/x-admin/js/xadmin.js}"></script>
    </head>
    
    <body>
        <div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">首页</a>
                <a href="">演示</a>
                <a>
                    <cite>导航元素</cite></a>
            </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload();" title="刷新">
                <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
            </a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-body ">
                            <form class="layui-form layui-col-space5">
<!--                                <div class="layui-input-inline layui-show-xs-block">-->
<!--                                    <input type="text" id="orderNum_s" name="orderNum_s" placeholder="请输入订单号" autocomplete="off" class="layui-input" th:value="${orderNum_s}"></div>-->
<!--                                <div class="layui-input-inline layui-show-xs-block">-->
<!--                                    <button class="layui-btn" onclick="query()">-->
<!--                                        <i class="layui-icon">&#xe615;</i></button>-->
<!--                                </div>-->
                            </form>
                        </div>
                        <div class="layui-card-header">
<!--                            <button class="layui-btn layui-btn-danger" onclick="delAll()">-->
<!--                                <i class="layui-icon"></i>批量删除</button>-->
                            <button class="layui-btn" onclick="xadmin.open('添加角色','/role/addUI',800,600)">
                                <i class="layui-icon"></i>添加</button></div>
                        <div class="layui-card-body ">
                            <table class="layui-table layui-form">
                                <thead>
                                    <tr>
                                        <th>
                                            <input type="checkbox" name="" lay-skin="primary">
                                        </th>
                                        <th>角色ID</th>
                                        <th>角色名称</th>
                                        <th>角色编号</th>
                                        <th>操作</th></tr>
                                </thead>
                                <tbody>
                                    <tr th:each="table_item:${pageInfo.list}">
                                        <td><input type="checkbox" name="" lay-skin="primary"></td>
                                        <td th:text="${table_item.roleId}"></td>
                                        <td th:text="${table_item.roleName}"></td>
                                        <td th:text="${table_item.roleCode}"></td>
                                        <td>
                                            <a title="删除" href="#"  th:onclick="|del(${table_item.roleId})|" class="tablelink"> <i class="layui-icon">&#xe640;</i></a>
                                            <a title="编辑" href="#"  th:onclick="|update(${table_item.roleId})|" class="tablelink"> <i class="layui-icon">&#xe63c;</i></a>
<!--                                            <a title="编辑" href="#" th:href="@{/room-order/updateUI(roomOrderId=${table_item.roomOrderId})}" class="tablelink"><i class="layui-icon">&#xe63c;</i></a>-->
                                            <a title="分配权限" href="#" th:href="@{/role-permission/FPPermissionUI/(roleId=${table_item.roleId})}" class="tablelink"><i class="layui-icon">&#xe614;</i></a>
                                        </td>
                                </tbody>
                            </table>
                        </div>
                        <div class="layui-card-body">
                            <div>
                                当前第 [[${pageInfo.pageNum}]]页，共 [[${pageInfo.pages}]] 页， 共 [[${pageInfo.total}]] 条记录
                            </div>

                            <table class="layui-table layui-form">
                                <button class="layui-btn layui-btn-xs">
                                    <a th:href="'/role/list?pageNum=1'">首页</a>
                                </button>
                                <button class="layui-btn layui-btn-xs" th:if="${pageInfo.hasPreviousPage}">
                                    <a th:href="'/role/list?pageNum='+${pageInfo.prePage}">
                                        <i class="ace-icon fa fa-angle-double-left"></i>
                                    </a>
                                </button>
                                <!--遍历条数-->
                                <button class="layui-btn layui-btn-xs" th:each="nav:${pageInfo.navigatepageNums}">
                                    <a th:href="'/role/list?pageNum='+${nav}" th:text="${nav}" th:if="${nav != pageInfo.pageNum}"></a>
                                    <span style="font-weight: bold;background: #6faed9;" th:if="${nav == pageInfo.pageNum}" th:text="${nav}" ></span>
                                </button>

                                <button class="layui-btn layui-btn-xs" th:if="${pageInfo.hasNextPage}">
                                    <a th:href="'/role/list?pageNum='+${pageInfo.nextPage}">
                                        <i class="ace-icon fa fa-angle-double-right"></i>
                                    </a>
                                </button>
                                <button class="layui-btn layui-btn-xs">
                                    <a th:href="'/role/list?pageNum='+${pageInfo.pages}">尾页</a>
                                </button>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <script>layui.use(['laydate', 'form'],
        function() {
            var laydate = layui.laydate;

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
        });

        /*用户-停用*/
        // function member_stop(obj, id) {
        //     layer.confirm('确认要停用吗？',
        //     function(index) {
        //
        //         if ($(obj).attr('title') == '启用') {
        //
        //             //发异步把用户状态进行更改
        //             $(obj).attr('title', '停用');
        //             $(obj).find('i').html('&#xe62f;');
        //
        //             $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
        //             layer.msg('已停用!', {
        //                 icon: 5,
        //                 time: 1000
        //             });
        //
        //         } else {
        //             $(obj).attr('title', '启用');
        //             $(obj).find('i').html('&#xe601;');
        //
        //             $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
        //             layer.msg('已启用!', {
        //                 icon: 5,
        //                 time: 1000
        //             });
        //         }
        //
        //     });
        // }

    /**
     * 角色删除
     * @author longyajr
     * @param id
     */
    function del(id) {
        if(confirm("是否删除该角色？")){
            $.ajax({
                url:'/role/delete',
                dataType:'json',
                type:'post',
                //同步
                async:false,
                data:{
                    roleId:id,
                },success:function(data){
                    let result = data.code;
                    if(result == 200){
                        alert("删除成功！");
                        location.reload();
                    }else{
                        alert("删除失败！");
                    }
                },
                error:function () {
                    alert("服务器异常");
                }
            })
        }
    }

    /**
     * 角色修改
     * @author longyajr
     * @param roleId
     */
    function update(roleId) {
        var url='/role/updateUI?roleId='+ roleId ;
        xadmin.open('修改角色',url,800,600);
    }

    function query() {
        $.ajax({
            url:'/room-order/admin/list',
            dataType:'json',
            type:'get',
            data: {
                orderNum: $('#orderNum').val(),
            }
            // ,success:function() {
            //     location.replace(location.href);
            // },error:function () {
            //     alert("服务器异常");
            // }
        })
    }


        function delAll(argument) {

            var data = tableCheck.getData();

            layer.confirm('确认要删除吗？' + data,
            function(index) {
                //捉到所有被选中的，发异步进行删除
                layer.msg('删除成功', {
                    icon: 1
                });
                $(".layui-form-checked").not('.header').parents('tr').remove();
            });
        }</script>

</html>